import 'package:azring/common/res/assets.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import '../common/styles/theme_manager.dart';

/// 健康指标卡片组件
class HealthMetricCard extends StatelessWidget {
  /// 卡片宽度
  final double? width;

  /// 卡片高度
  final double? height;

  /// 卡片内容
  final Widget child;

  /// 背景颜色
  final Color? backgroundColor;

  /// 圆角半径
  final double? borderRadius;

  const HealthMetricCard({
    super.key,
    this.width,
    this.height,
    required this.child,
    this.backgroundColor,
    this.borderRadius,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      width: width,
      height: height,
      padding: EdgeInsets.only(top: 11.h, left: 14.w, right: 14.w),
      decoration: BoxDecoration(
        color: backgroundColor ?? const Color(0xFF353235),
        borderRadius: BorderRadius.circular(borderRadius ?? 12.r),
      ),
      child: child,
    );
  }
}

/// 健康指标卡片构建器 - 用于快速创建不同类型的健康指标卡片
class HealthMetricCardBuilder {
  /// 创建活动卡片
  static Widget buildActivityCard({
    required String steps,
    required String target,
    double? width,
    double? height,
  }) {
    return HealthMetricCard(
      width: width,
      height: height,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              Text(
                steps,
                style: TextStyle(
                  fontSize: 20.sp,
                ),
              ),
              SizedBox(width: 3.w),
              Text(
                "步",
                style: TextStyle(
                  fontSize: 14.sp,
                ),
              ),
              const Spacer(),
              Assets.status.steps.image(
                width: 18.w,
                height: 18.w,
              )
            ],
          ),
          SizedBox(height: 1.h),
          Text(
            '活动',
            style: TextStyle(
              fontSize: 13.sp,
            ),
          ),
          SizedBox(height: 8.h),
          Text(
            '目标任务${target}步',
            style: TextStyle(
              fontSize: 11.sp,
              color: ThemeManager.to.secondaryTextColor,
            ),
          ),
        ],
      ),
    );
  }

  /// 创建睡眠卡片
  static Widget buildSleepCard({
    required String minutes,
    required String quality,
    double? width,
    double? height,
  }) {
    return HealthMetricCard(
      width: width,
      height: height,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              Text(
                minutes,
                style: TextStyle(
                  fontSize: 20.sp,
                ),
              ),
              SizedBox(width: 3.w),
              Text(
                "分",
                style: TextStyle(
                  fontSize: 14.sp,
                ),
              ),
              const Spacer(),
              Assets.status.sleepIcon.image(
                width: 18.w,
                height: 18.w,
              )
            ],
          ),
          SizedBox(height: 4.h),
          Text(
            '睡眠',
            style: TextStyle(
              fontSize: 13.sp,
            ),
          ),
          SizedBox(height: 5.h),
          Container(
            padding: EdgeInsets.symmetric(
              horizontal: 6.w,
              vertical: 2.h,
            ),
            decoration: BoxDecoration(
              color: const Color.fromRGBO(33, 74, 59, 0.3),
              borderRadius: BorderRadius.circular(4.r),
            ),
            child: Text(
              '质量评分: $quality',
              style: TextStyle(
                fontSize: 10.sp,
                color: const Color(0xff16B784),
              ),
            ),
          ),
        ],
      ),
    );
  }

  /// 创建心率卡片
  static Widget buildHeartRateCard({
    required String bpm,
    required String change,
    required bool isIncrease,
    required String title,
    required String range,
    double? width,
    double? height,
  }) {
    return HealthMetricCard(
      width: width,
      height: height,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              Text(
                bpm,
                style: TextStyle(
                  fontSize: 20.sp,
                ),
              ),
              SizedBox(width: 3.w),
              Text(
                "bpm",
                style: TextStyle(
                  fontSize: 14.sp,
                ),
              ),
              const Spacer(),
              Row(
                children: [
                  Icon(
                    isIncrease ? Icons.trending_up : Icons.trending_down,
                    color: isIncrease ? Colors.red : Colors.green,
                    size: 16.sp,
                  ),
                  SizedBox(width: 2.w),
                  Text(
                    change,
                    style: TextStyle(
                      fontSize: 12.sp,
                      color: isIncrease ? Colors.red : Colors.green,
                    ),
                  ),
                ],
              ),
            ],
          ),
          SizedBox(height: 1.h),
          Text(
            title,
            style: TextStyle(
              fontSize: 13.sp,
            ),
          ),
          SizedBox(height: 8.h),
          Text(
            range,
            style: TextStyle(
              fontSize: 11.sp,
              color: ThemeManager.to.secondaryTextColor,
            ),
          ),
        ],
      ),
    );
  }

  /// 创建血氧卡片
  static Widget buildBloodOxygenCard({
    required String percentage,
    required String range,
    double? width,
    double? height,
  }) {
    return HealthMetricCard(
      width: width,
      height: height,
      child: Stack(
        children: [
          // 右上角背景图 - 不占用布局空间
          Positioned(
            top: 0,
            right: 0,
            child: Assets.status.hrBg.image(
              width: 40.w,
              height: 40.h,
            ),
          ),
          // 主要内容
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                children: [
                  Text(
                    percentage,
                    style: TextStyle(
                      fontSize: 20.sp,
                      color: Colors.white,
                    ),
                  ),
                  SizedBox(width: 3.w),
                  Text(
                    "%",
                    style: TextStyle(
                      fontSize: 14.sp,
                      color: Colors.white,
                    ),
                  ),
                ],
              ),
              SizedBox(height: 1.h),
              Text(
                '血氧',
                style: TextStyle(
                  fontSize: 13.sp,
                  color: Colors.white,
                ),
              ),
              SizedBox(height: 4.h),
              Text(
                '范围$range',
                style: TextStyle(
                  fontSize: 11.sp,
                  color: ThemeManager.to.secondaryTextColor,
                ),
              ),
            ],
          ),
        ],
      ),
    );
  }

  /// 创建合并的健康指标卡片（静息心率、心率变异性、血氧）
  static Widget buildCombinedHealthCard({
    required String heartRate,
    required String heartRateChange,
    required bool heartRateIncrease,
    required String hrv,
    required String hrvChange,
    required bool hrvIncrease,
    required String bloodOxygen,
    double? width,
    double? height,
  }) {
    return HealthMetricCard(
      width: width,
      height: height,
      child: Stack(
        children: [
          // 右上角背景图 - 不占用布局空间
          Positioned(
            top: 0,
            right: 0,
            child: Assets.status.hrBg.image(
              width: 54.w,
              height: 46.h,
            ),
          ),
          // 主要内容 - 三个指标水平排列
          Row(
            children: [
              // 静息心率
              Expanded(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Text(
                          heartRate,
                          style: TextStyle(
                            fontSize: 20.sp,
                            color: Colors.white,
                          ),
                        ),
                        SizedBox(width: 3.w),
                        Text(
                          "bpm",
                          style: TextStyle(
                            fontSize: 14.sp,
                            color: Colors.white,
                          ),
                        ),
                        if (heartRateChange.isNotEmpty && heartRateChange != '--') ...[
                          SizedBox(width: 3.w),
                          Row(
                            children: [
                              Icon(
                                heartRateIncrease ? Icons.trending_up : Icons.trending_down,
                                color: heartRateIncrease ? Colors.red : Colors.green,
                                size: 16.sp,
                              ),
                              SizedBox(width: 2.w),
                              Text(
                                heartRateChange,
                                style: TextStyle(
                                  fontSize: 12.sp,
                                  color: heartRateIncrease ? Colors.red : Colors.green,
                                ),
                              ),
                            ],
                          ),
                        ],
                      ],
                    ),
                    SizedBox(height: 1.h),
                    Text(
                      '静息心率',
                      style: TextStyle(
                        fontSize: 13.sp,
                      ),
                    ),
                    SizedBox(height: 8.h),
                    Text(
                      '范围60-100次',
                      style: TextStyle(
                        fontSize: 11.sp,
                        color: ThemeManager.to.secondaryTextColor,
                      ),
                    ),
                  ],
                ),
              ),
              SizedBox(width: 8.w),
              // 心率变异性
              Expanded(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Text(
                          hrv,
                          style: TextStyle(
                            fontSize: 20.sp,
                          ),
                        ),
                        SizedBox(width: 3.w),
                        Text(
                          "bpm",
                          style: TextStyle(
                            fontSize: 14.sp,
                          ),
                        ),
                        if (hrvChange.isNotEmpty && hrvChange != '--') ...[
                          SizedBox(width: 2.w),
                          Row(
                            children: [
                              Icon(
                                hrvIncrease ? Icons.trending_up : Icons.trending_down,
                                color: hrvIncrease ? Colors.red : Colors.green,
                                size: 16.sp,
                              ),
                              SizedBox(width: 2.w),
                              Text(
                                hrvChange,
                                style: TextStyle(
                                  fontSize: 12.sp,
                                  color: hrvIncrease ? Colors.red : Colors.green,
                                ),
                              ),
                            ],
                          ),
                        ],
                      ],
                    ),
                    SizedBox(height: 1.h),
                    Text(
                      '心率变异性',
                      style: TextStyle(
                        fontSize: 13.sp,
                      ),
                    ),
                    SizedBox(height: 8.h),
                    Text(
                      '测基准线量一周后',
                      style: TextStyle(
                        fontSize: 11.sp,
                        color: ThemeManager.to.secondaryTextColor,
                      ),
                    ),
                  ],
                ),
              ),
              SizedBox(width: 2.w),
              // 血氧
              Expanded(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Text(
                          bloodOxygen,
                          style: TextStyle(
                            fontSize: 20.sp,
                          ),
                        ),
                        SizedBox(width: 3.w),
                        Text(
                          "%",
                          style: TextStyle(
                            fontSize: 14.sp,
                          ),
                        ),
                      ],
                    ),
                    SizedBox(height: 1.h),
                    Text(
                      '血氧',
                      style: TextStyle(
                        fontSize: 13.sp,
                      ),
                    ),
                    SizedBox(height: 8.h),
                    Text(
                      '范围95-100%',
                      style: TextStyle(
                        fontSize: 11.sp,
                        color: ThemeManager.to.secondaryTextColor,
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ],
      ),
    );
  }
}
